<template>
  <div class="outer">
    <h1>News</h1>
  </div>
</template>

<script>
export default {
  name:'News',
  beforeRouteEnter(to,from,next){
    console.log('beforeRouteEnter,组件内守卫，进来就触发',this);
    next()
  },
  beforeRouteUpdate(to,from,next){
    console.log('beforeRouteUpdate,组件内守卫，当前组件复用但更新了',this);
    next()
  },
  beforeRouteLeave(to,from,next){
    console.log('beforeRouteLeave,组件内守卫，当前路由离开',this);
    next()
  }
}
</script>

<style scoped>
  .outer{
    width: 100%;
    height: 400px;
    background: pink;
  }
</style>